<template>
    <div>
<h1>修改商铺信息</h1>

<table class="table">
<tbody>
    <tr>
        <td>商铺名称</td>
        <td>
            <input type="text" v-model="da.sName">
        </td>
    </tr>

     <tr>
        <td>商铺楼层</td>
        <td>
           <select v-model="da.louCeng">
             <option value="">请选择</option>
            <option value="1层">1层</option>
            <option value="2层">2层</option>
            <option value="3层">3层</option>
           </select>
        </td>
    </tr>

     <tr>
        <td>业主名称</td>
        <td>
            <input type="text" v-model="da.userName">
        </td>
    </tr>

     <tr>
        <td>联系电话</td>
        <td>
            <input type="text" v-model="da.phone">
        </td>
    </tr>

     <tr>
        <td>房屋状态</td>
        <td>
            <select v-model="da.zhuangID">
    <option v-for="a in ba" :value="a.zId">{{ a.zName }}</option>
</select>
        </td>
    </tr>

    <tr>
        <td>
            <a href="/">返回</a>
        </td>
        <td>
            <input type="button" value="修改" @click="xiu">
        </td>
    </tr>
</tbody>
</table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, ref } from 'vue';
import { useRoute ,useRouter} from 'vue-router';

const fa=useRoute()
const uc=useRouter()
onMounted(()=>{
    bang()
    fan()
})

const ba=ref([{
    "zId": 0,
    "zName": ""
  }])


const bang=()=>{
    axios.get("https://localhost:7170/api/Kzq/BangZt").then(res=>{
        ba.value=res.data
    })
}

const da=ref({
  
  "sName": "",
  "louCeng": "",
  "userName": "",
  "phone": "",
  "zhuangID": 0,
})

const fan=()=>{
    axios.get("https://localhost:7170/api/Kzq/FanSp",{params:{id:fa.query.id}}).then(res=>{
        da.value=res.data
    })
}

const xiu=()=>{
if(da.value.louCeng==""||da.value.phone==""||da.value.sName==""||da.value.userName==""||da.value.zhuangID==0){
    alert("不能为空");
    return
}

var zz=/^\d{11}$/
if(!zz.test(da.value.phone)){
    alert("联系电话格式错误");
    return;
}


    axios.put("https://localhost:7170/api/Kzq/XiuSp",da.value).then(res=>{
        if(res.data==-1){
            alert("联系电话已存在");
            return
        }
        if(res.data>0){
            alert("修改成功");
            uc.push({path:'/'})
        }else{
            alert("修改失败")
        }
    })
}


</script>

<style scoped>

</style>
